<template>
  <div class="new-list">
    <van-card
      v-for="item in newslist"
      :key="item.id"
      :title="item.title"
      :thumb="item.img_url"
      :thumb-link="'#/home/newsinfo/' + item.id"
    >
      <template #bottom>
        <div class="btn-group">
          <span class="add-time">{{ item.add_time }}</span>
          <span>点击{{ item.click }}次</span>
        </div>
      </template>
    </van-card>
  </div>
</template>
<script>
import { getNewsList } from '@/api/news'
export default {
  data() {
    return {
      newslist: []
    }
  },
  created() {
    this.getNewsList()
  },
  methods: {
    async getNewsList() {
      const res = await getNewsList()
      this.newslist = res.data.message
    }
  }
}
</script>
<style lang="scss" scoped>
.new-list {
  .van-card__content {
    min-height: 55px;
  }
  .van-card__thumb {
    height: 55px;
  }
  .van-card__title {
    // overflow: hidden;
    // text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  }
  .btn-group {
    display: flex;
    justify-content: space-between;
    .add-time {
      color: red;
    }
  }
}
</style>